<template>
	<div class="cart">
		<nav-bar class="nav-bar">
			<div slot="center">购物车({{length}})</div>
		</nav-bar>
		<cart-list></cart-list>
		<cart-bottom-bar></cart-bottom-bar>
	</div>
</template>

<script>
	import NavBar from '../../components/common/navbar/NavBar.vue'
	import CartList from './childComps/Cartlist.vue'
	import {mapGetters } from 'vuex'
	import CartBottomBar from './childComps/CartBottonBar.vue'
	export default{
		components:{
			NavBar,CartList,CartBottomBar
		},
		computed:{
			...mapGetters({
				length:'cartLengh',
				list:'cartList'
			})
		}
	}
</script>

<style scoped="scoped">
	.cart{
		height: 100vh;
	}
	.nav-bar{
		background-color: lightpink;
		color: #fff;
		font-weight: 600;
	}
</style>
